// 主题色
$color-primary: #518aff;
$color-success: #5ad8a6;
$color-warning: #ffad08;
$color-danger: #ff5858;
$color-info: #909399;

// 文字颜色
$text-primary: #303133;
$text-regular: #606266;
$text-secondary: #909399;
$text-placeholder: #c0c4cc;
$text-disabled: #c0c4cc;

// 边框颜色
$border-base: #dcdfe6;
$border-light: #e4e7ed;
$border-lighter: #ebeef5;
$border-extra-light: #f2f6fc;

// 背景色
$bg-base: #ffffff;
$bg-light: #f2f3f5;
$bg-hover: #f5f7fa;
$bg-disabled: #f5f7fa;

// 字体
$font-family:
  'PingFang SC',
  -apple-system,
  BlinkMacSystemFont,
  'SF Pro SC',
  'SF Pro Text',
  'Helvetica Neue',
  Arial,
  sans-serif;

// 字号
$font-size-h1: 32px; // 大标题
$font-size-h2: 24px; // 主标题
$font-size-h3: 20px; // 次标题
$font-size-h4: 18px; // 小标题
$font-size-body: 16px; // 正文
$font-size-small: 12px; // 辅助文字

// 圆角
$radius-base: 4px;
$radius-medium: 6px;
$radius-large: 8px;
$radius-round: 20px;

// 阴影
$shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12);
$shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
$shadow-medium: 0 4px 16px rgba(0, 0, 0, 0.12);
$shadow-dark: 0 8px 24px rgba(0, 0, 0, 0.12);

// 过渡
$transition-base: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
$transition-fade: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
$transition-transform: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);

// 断点
$breakpoint-xs: 480px;
$breakpoint-sm: 768px;
$breakpoint-md: 992px;
$breakpoint-lg: 1200px;
$breakpoint-xl: 1920px;

// 兼容别名 (为了向后兼容，后续可以逐步替换掉)
$border-radius-base: $radius-base;
$border-radius-medium: $radius-medium;
$border-radius-large: $radius-large;
$border-radius-extra-large: $radius-round;

$box-shadow-base: $shadow-base;
$box-shadow-light: $shadow-light;
$box-shadow-dark: $shadow-dark;

$font-size-extra-large: $font-size-h1;
$font-size-large: $font-size-h2;
$font-size-medium-large: $font-size-h3;
$font-size-medium: $font-size-h4;
$font-size-base: $font-size-body;
$font-size-extra-small: $font-size-small;

// 为了兼容旧的 mixins
$primary-color: $color-primary;
$success-color: $color-success;
$warning-color: $color-warning;
$danger-color: $color-danger;
$info-color: $color-info;

// 其他兼容别名
$font-size-title: $font-size-h1; // 页面标题
$font-size-subtitle: $font-size-h2; // 主标题
$font-size-heading: $font-size-h3; // 次级标题
$font-size-subheading: $font-size-h4; // 小标题
$font-size-body: $font-size-body; // 正文
$font-size-caption: $font-size-small; // 说明文字
$font-size-auxiliary: $font-size-small; // 辅助文字

// 行高兼容
$line-height-tight: 1.2;
$line-height-base: 1.5;
$line-height-loose: 1.8;
